<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <input type="button" value="Ajax1" onclick="Ajax();">

{#    <input type="text" id="url" >#}
{#    <input type="button" value="发送iframe请求" onclick="iframeRequest();">#}
{#    <iframe id='ifm' src="http://www.baidu.com"></iframe>#}

    <form action="/ajax_json/" method="POST" target="ifm1">
        {% csrf_token %}
        <iframe id="ifm1" name="ifm1">
        </iframe>
        <input type="text" name="username">
        <input type="text" name="email">
        <input type="submit" onclick="submitForm();" value="FORM提交">
    </form>
    <script type="text/javascript" src="/static/js/jquery-1.12.4.js"></script>
    <script>
        function getXHR() {
            var xhr = null;
            if(XMLHttpRequest){
                xhr = new XMLHttpRequest();
            }else{
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
            return xhr;
        }

        function Ajax() {
            var xhr = new getXHR();
            xhr.onreadystatechange = function (ev) {
                if (xhr.readyState == 4) {
                    console.log(xhr.responseText);
                }
            };
            xhr.open('POST', '/ajax_json/');

            xhr.setRequestHeader('k1', 'v1');
            xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset-UTF-8');
            xhr.send("name=root;pwd=123");
        }
        function iframeRequest() {
                var url = $('#url').val();
                $('#ifm').attr('src',url);
        }
        function submitForm(){
            $('#ifm1').load(function () {
                var text = $('#ifm1').contents().find('body').text();
                var obj = JSON.parse(text)
                console.log(obj)

            })
        }

    </script>
</body>
</html>